<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">
    <title>甬邦会务</title>
    <link rel="stylesheet" href="${ctx}/resources/yb/style/weui/weui.min.css" />
    <link rel="stylesheet" href="${ctx}/resources/yb/style/weui/example.css" />
    <link rel="stylesheet" href="${ctx}/resources/yb/style/weui/weuiNew.min.css" />
    <link rel="stylesheet" href="${ctx}/resources/yb/style/weui/plus.css" />


    <script src="http://cdn.bootcss.com/jquery/1.8.3/jquery.js"></script>
    <script src="${ctx}/resources/yb/js/app.js"></script>
    <script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
    <script src="${ctx}/resources/yb/js/wechat.api.js"></script>
    <meta name="format-detection" content="telephone=no" />
    <style type="text/css">
        section {
            max-width: 100%;
        }
    </style>
</head>
<body>
<script>
    $(function () {
        var url = window.location.href;
        url = url.replace(/&/g, "%26");
        $.ajax({
            url: '/OAuth/WxShare?url=' + url,
            type: 'POST',
            dataType: 'json',
            success: function (data) {
                wx.config({
                    debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。  //appId: "wx8c534c995ee68d7e", // 必填，公众号的唯一标识
                    appId: data.AppId, // 必填，公众号的唯一标识
                    timestamp: data.Timestamp, // 必填，生成签名的时间戳
                    nonceStr: data.NonceStr, // 必填，生成签名的随机串
                    signature: data.Signature, // 必填，签名，见附录1
                    jsApiList: [
                        'onMenuShareAppMessage',
                        'onMenuShareTimeline',
                        'hideOptionMenu',
                        'showOptionMenu',
                        'showMenuItems',
                        'hideMenuItems',
                        'openLocation'
                    ] // 必填，需要使用的JS接口列表，所有JS接口列表见附录2
                });
            }
        });
        WeChat.hideOptionMenu();
    })
</script>

<style type="text/css">
    #qrcodeBig {
        position: fixed;
        top: 45px;
        background: #fff;
        width: 100%;
        height: 100%;
        display: none;
    }

    #qrcodeBig .qrcode img {
        width: 76%;
        margin: auto;
        display: block;
        margin-top: 29px;
    }

    #qrcodeBig .weui_btn_area {
        width: 70%;
        margin: auto;
        margin-top: 30px;
    }

</style>
<script src="http://cdn.bootcss.com/jquery/1.8.0/jquery-1.8.0.min.js"></script>
<script src="http://cdn.bootcss.com/lrsjng.jquery-qrcode/0.12.0/jquery.qrcode.js"></script>
<script>
    $(function () {
        $("#qrcode").qrcode({
            render: 'image',
            size: 189,
            text: "${activityUser.activityCode}",
            background: "#fff",
            quiet: 1
        });

        $("#qrcodeBig .qrcode").qrcode({
            render: 'image',
            size: 1000,
            text: "${activityUser.activityCode}",
            background: "#fff",
            quiet: 1
        });

        $('#qrcode').click(function () {
            $('#qrcodeBig').show();
        });
    })
</script>
<div class="page slideIn cell">

    <header class="ui-header ui-header-positive site-header">
        <div class="ui-whitespace system" onclick="history.go(-1)">
        </div>
        <h1 class="ui-nowrap">${activityUser.activityName}</h1>
    </header>
    <div class="bd">
        <div class="pingz">
            <div class="img">
                <div id="qrcode">
                </div>

            </div>
            <div class="title">
                报名凭证：<span>${activityUser.activityCode}</span>
            </div>
        </div>
        <div class="weui_cells">
            <div class="weui_cell">
                <div class="weui_cell_bd weui_cell_primary">
                    <p>姓名</p>
                </div>
                <div class="weui_cell_ft">${userInfo.name}</div>
            </div>

            <div class="weui_cell">
                <div class="weui_cell_bd weui_cell_primary">
                    <p>手机</p>
                </div>
                <div class="weui_cell_ft">${userInfo.phone}</div>
            </div>

        </div>

        <p class="weui_btn_area">
            <a href="${ctx}/mobileActivity/event/${activityUser.activityId}/user${userInfo.id}" class="weui-btn weui-btn_primary">返回活动页</a>
        </p>
        <p class="weui_btn_area">
            <a href="${ctx}/mobileActivity/toSignUp/${activityUser.activityId}?userId=${activityUser.userId}" class="weui-btn weui-btn_primary">修改</a>
        </p>
        <p class="weui_btn_area">
            <a href="javascript:;" id="cancelJoin" class="weui_btn weui_btn_warn">取消报名</a>
        <div class="tip">如发现信息有误，请取消后重新报名<span style="display: none;">报名截止状态无法取消报名</span></div>
        </p>
    </div>
</div>

<div style="" id="qrcodeBig">
    <div class="qrcode">
    </div>
    <p class="weui_btn_area">
        <a href="javascript:$('#qrcodeBig').hide();" class="weui-btn weui-btn_default">返回</a>
    </p>
</div>

<script>
    $(function () {
        $('#cancelJoin').click(function () {
            App.confirmDialog('确定要取消报名吗?', '取消提醒');
        });
        $('#btnConfirm').live('click', function () {
            $.ajax({
                type: 'POST',
                url: '/mobileActivity/cancelJoin/${activityUser.id}',
                beforeSend: function () {
                    App.showLoading('');
                },
                dataType: "json",
                error: function(xhr, textStatus, errorThrown){
                    App.hideLoading;
                    App.alertDialog("取消失败");
                },
                success: function (data) {
                    App.hideLoading();
                    switch (data.code) {
                        case 200:
                            if (data.msg == '' || data.msg == null) {
                                App.showToast();
                            } else {
                                App.showToast(data.msg);
                            }
                            setTimeout(function () {
                                window.location.href ="${ctx}/mobileActivity/event/${activityUser.activityId}";
                            }, 1000);
                            break;
                        case 500:
                            App.alertDialog(data.msg);
                            break;
                        default:
                    }
                }
            });
        });
    });
</script>
</body>
</html>
